<template>
	<page-meta :page-style="'overflow:'+(showSignin||showDSSPoup||popupImg||popupGImg||indexGuide>0?'hidden':'visible')"></page-meta>
	<view class="index" :style="'padding-bottom:'+pdbottom+'rpx;'">
		<view class="swiper_img_box" v-if="bannerlist.length>1">
			<swiper class="swiper" circular :autoplay="true" :interval="3000" :duration="500" :indicator-dots="false"
				@change="changeBanner">
				<swiper-item v-for="item in bannerlist" :key="item.id">
					<image @click="goBannerPath(item.type,item.path,item.appId,1)" class="swiper_img"
						:src="picUrl+item.pic" mode="aspectFill">
					</image>
					<view v-if="item.is_video==1" class="swiper_video_icon"
						@click="goBannerPath(item.type,item.path,item.appId,1)">
						<image class="video_icon" :src="onlinePic+'video_listicon.png'"></image>
					</view>
				</swiper-item>
			</swiper>
			<view class="swiper_dot_box">
				<view v-for="(item,index) in bannerlist" :key="index"
					:class="current==index?'swiper_dot swiper_dot_active':'swiper_dot'"></view>
			</view>
		</view>
		<view class="swiper_img_box" v-if="bannerlist.length==1">
			<view class="swiper">
				<image @click="goBannerPath(bannerlist[0].type,bannerlist[0].path,bannerlist[0].appId,1)" class="swiper_img"
					:src="picUrl+bannerlist[0].pic" mode="aspectFill">
				</image>
				<view v-if="bannerlist[0].is_video==1" class="swiper_video_icon"
					@click="goBannerPath(bannerlist[0].type,bannerlist[0].path,bannerlist[0].appId,1)">
					<image class="video_icon" :src="onlinePic+'video_listicon.png'"></image>
				</view>
			</view>
		</view>
		<view class="pd-30">
			<view class="swiper_group_box" v-if="recommendlist1.length>0">
				<swiper v-if="recommendlist1.length>1" class="swiper_group" circular :autoplay="false" :interval="3500"
					:duration="800" @change="changeSwiper1">
					<swiper-item class="swiper_group_item" v-for="item in recommendlist1" :key="item.id"
						@click="goBannerPath(item.type,item.path,2)">
						<image class="swiper_group_img" :src="picUrl+item.pic" mode="aspectFill"></image>
						<image v-if="item.label" class="index_swiper_tips" :src="picUrl+item.label"></image>
						<view class="group_mask_box" v-if="item.car_model"></view>
						<view class="group_content_box" v-if="item.pic">
							<view class="group_carmodel" v-if="item.car_model">{{item.car_model}}</view>
							<!-- <view class="group_carmodel_bottom"></view> -->
							<view class="group_name">{{item.title}}</view>
						</view>
						<view v-if="item.address" class="swiper_group_address display_flex">
							<uni-icons type="location-filled" size="10" color="#ffffff"></uni-icons>
							<view>{{item.address}}</view>
						</view>
					</swiper-item>
				</swiper>
				<view v-if="recommendlist1.length>1" class="swiper_group_dot_box">
					<view v-for="(item,index) in recommendlist1" :key="index"
						:class="current1==index?'swiper_dot swiper_dot_active':'swiper_dot'"></view>
				</view>
				<view class="swiper_group" v-if="recommendlist1.length==1">
					<view class="swiper_group_item"
						@click="goBannerPath(recommendlist1[0].type,recommendlist1[0].path,recommendlist1[0].appId,2)">
						<image class="swiper_group_img" :src="picUrl+recommendlist1[0].pic" mode="aspectFill"></image>
						<image v-if="item.label" class="index_swiper_tips" :src="picUrl+recommendlist1[0].label">
						</image>
						<view class="group_mask_box" v-if="recommendlist1[0].car_model"></view>
						<view class="group_content_box">
							<view class="group_carmodel" v-if="recommendlist1[0].car_model">
								{{recommendlist1[0].car_model}}
							</view>
							<!-- <view class="group_carmodel_bottom"></view> -->
							<view class="group_name">{{recommendlist1[0].title}}</view>
						</view>
						<view v-if="recommendlist1[0].address" class="swiper_group_address display_flex">
							<uni-icons type="location-filled" size="10" color="#ffffff"></uni-icons>
							<view>{{recommendlist1[0].address}}</view>
						</view>
					</view>
				</view>
			</view>
			<view class="swiper_group_box" v-if="recommendlist2.length>0">
				<swiper v-if="recommendlist2.length>1" class="swiper_group" circular :autoplay="false" :interval="3500"
					:duration="800" @change="changeSwiper2">
					<swiper-item class="swiper_group_item" v-for="item in recommendlist2" :key="item.id"
						@click="goBannerPath(item.type,item.path,3)">
						<image class="swiper_group_img" :src="picUrl+item.pic" mode="aspectFill"></image>
						<image v-if="item.label" class="index_swiper_tips" :src="picUrl+item.label"></image>
						<view class="group_mask_box" v-if="item.car_model"></view>
						<view class="group_content_box" v-if="item.pic">
							<view class="group_carmodel" v-if="item.car_model">{{item.car_model}}</view>
							<!-- <view class="group_carmodel_bottom"></view> -->
							<view class="group_name">{{item.title}}</view>
						</view>
						<view v-if="item.address" class="swiper_group_address_border display_flex">
							<view>{{item.address}}</view>
						</view>
					</swiper-item>
				</swiper>
				<view v-if="recommendlist2.length>1" class="swiper_group_dot_box">
					<view v-for="(item,index) in recommendlist2" :key="index"
						:class="current2==index?'swiper_dot swiper_dot_active':'swiper_dot'"></view>
				</view>
				<view class="swiper_group" v-if="recommendlist2.length==1">
					<view class="swiper_group_item"
						@click="goBannerPath(recommendlist2[0].type,recommendlist2[0].path,recommendlist2[0].appId,3)">
						<image class="swiper_group_img" :src="picUrl+recommendlist2[0].pic" mode="aspectFill"></image>
						<image v-if="item.label" class="index_swiper_tips" :src="picUrl+recommendlist2[0].label">
						</image>
						<view class="group_mask_box" v-if="recommendlist2[0].car_model"></view>
						<view class="group_content_box">
							<view class="group_carmodel" v-if="recommendlist2[0].car_model">
								{{recommendlist2[0].car_model}}
							</view>
							<!-- <view class="group_carmodel_bottom"></view> -->
							<view class="group_name">{{recommendlist2[0].title}}</view>
						</view>
						<view v-if="recommendlist2[0].address" class="swiper_group_address display_flex">
							<uni-icons type="location-filled" size="10" color="#ffffff"></uni-icons>
							<view>{{recommendlist2[0].address}}</view>
						</view>
					</view>
				</view>
			</view>
			<view class="index_center_btn_box" v-if="index_button_left">
				<uni-row v-if="index_button_right" :gutter="25">
					<uni-col :span="12">
						<image @click="goIndexButton(1)" class="index_center_btn_img"
							:src="picUrl+index_button_left.img_new" mode="widthFix"
							:style="indexGuide==1?'z-index: 1002;position: relative;':''">
						</image>
					</uni-col>
					<uni-col :span="12">
						<image @click="goIndexButton(2)" class="index_center_btn_img"
							:src="picUrl+index_button_right.img_new" mode="widthFix"
							:style="indexGuide==2?'z-index: 1002;position: relative;':''">
						</image>
					</uni-col>
				</uni-row>
				<image v-else @click="goIndexButton(1)" class="index_center_btn_img"
					:src="picUrl+index_button_left.img_new" mode="widthFix"
					:style="indexGuide==1?'z-index: 1002;position: relative;':''">
				</image>
			</view>
			<view class="gongyi_box" v-if="welfareinfo">
				<view class="gongyi_img_box">
					<image class="gongyi_img" :src="picUrl+welfareinfo.pic" mode="aspectFill"></image>
				</view>
				<view class="gongyi_content_box">
					<view class="gongyi_content_title_box">
						<view class="f-18 f-w">{{welfareinfo.title}}</view>
					</view>
					<view class="display_flex mt-5">
						<image class="benefit_tips_img" :src="picUrl+welfareinfo.label"></image>
						<view class="xlxjh_text">{{welfareinfo.target}}</view>
					</view>
					<view class="gongyi_content_progress_box mt-15">
						<view :style="'width:' + jion_percent + '%;'" class="gongyi_progress_on"></view>
						<image class="flag_icon" :src="onlinePic+'flag_icon.png'"></image>
						<view class="gongyi_progres"></view>
					</view>
					<view class="display_flex mt-15" style="justify-content: space-between;">
						<view class="display_flex">
							<view class="f-13 c-887970">已有{{welfareinfo.join_number}}人参与</view>
						</view>
						<view class="display_flex">
							<view class="f-13 c-887970">捐赠目标</view>
							<view class="money_text">¥{{welfareinfo.target_money}}</view>
						</view>
					</view>
					<view class="display_flex mt-15 f-14">
						<image class="content_title_icon" :src="onlinePic+'xmjs_icon.png'"></image>
						<view class="ml-5">项目介绍</view>
					</view>
					<view class="f-12 mt-5 c-887970">
						<text>{{welfareinfo.desc}}</text>
					</view>
				</view>
			</view>
		</view>
		<view class="bbs_box_new">
			<view class="bbs_box_new_top">
				<uni-row>
					<uni-col :span="12">
						<view @click="changeIndexType(1)">
							<view class="bbs_box_top_title_left_box" :style="indexType==1?'color:#00A0DC;':''">
								<image v-if="indexType==1" class="active_area_img"
									:src="onlinePic+'active_area_img.png'"></image>
								活动专区
								<view v-if="indexType==1" class="racy_line_box"></view>
							</view>
						</view>
					</uni-col>
					<uni-col :span="12">
						<view @click="changeIndexType(2)">
							<view class="bbs_box_top_title_right_box" :style="indexType==2?'color:#00A0DC;':''">
								<image v-if="indexType==2" class="bbs_area_img" :src="onlinePic+'bbs_area_img.png'">
								</image>
								我的社区
								<view v-if="indexType==2" class="racy_line_box_right"></view>
							</view>
						</view>
					</uni-col>
				</uni-row>
				<view class="mt-15" v-if="indexType==2">
					<view class="index_bbs_mygroup_box" @click="goClubInfo(userinfo.club_id,userinfo.club_name)"
						v-if="userinfo.club_id>0">
						<view class="groupinfo_top">
							<view class="group_img_box">
								<image class="group_img" :src="picUrl + userinfo.club_logo" mode="aspectFill"></image>
								<image v-if="userinfo.club_border" class="group_border_img"
									:src="picUrl + userinfo.club_border" mode="aspectFill"></image>
							</view>
							<view class="group_title_box">
								<view class="f-16">{{userinfo.club_name}}</view>
								<view class="display_flex mt-5">
									<view class="display_flex ml-5">
										<image v-for="(item,index) in userinfo.club_user_avatar" :key="index"
											class="bbsinfo_praise_user_img" :src="picUrl +item">
										</image>
									</view>
									<view class="c-666666 f-10 ml-5">{{userinfo.club_user_text}}</view>
								</view>
							</view>
						</view>
					</view>
					<view class="index_bbs_tabs_box">
						<view class="index_bbs_tabs">
							<view :class="indexBbsType==1?'index_bbs_tabs_cell tabs_cell_on':'index_bbs_tabs_cell'"
								@click="changeBbsTabs(1)">
								<view>
									<view class="f-15" style="width: 120rpx;">全部帖子</view>
									<view
										:class="indexBbsType==1?'index_bbs_tabs_cell_bottom':'index_bbs_tabs_cell_bottom_def'">
									</view>
								</view>
							</view>
							<view :class="indexBbsType==2?'index_bbs_tabs_cell tabs_cell_on':'index_bbs_tabs_cell'"
								@click="changeBbsTabs(2)">
								<view>
									<view class="f-15" style="width: 120rpx;">我的帖子</view>
									<view
										:class="indexBbsType==2?'index_bbs_tabs_cell_bottom':'index_bbs_tabs_cell_bottom_def'">
									</view>
								</view>
							</view>
						</view>
					</view>
				</view>
			</view>
			<view v-if="indexType==1" class="index_active_box">
				<view v-if="activelist.length>0" class="index_active_cell" v-for="(item,index) in activelist"
					:key="item.huodong_id" @click="goActiveInfo(item.huodong_id,item.huodong_status,item.title)">
					<view class="index_active_imgs_box">
						<image class="index_active_imgs" :src="item.cover?picUrl+item.cover:picUrl+item.pic"
							mode="aspectFill">
						</image>
					</view>
					<view class="mt-10 f-14">
						{{item.title}}
						<text v-if="item.huodong_status==0" class="index_active_audit_before ml-5">招募中</text>
						<text v-if="item.huodong_status==1" class="index_active_audit_ing ml-5">进行中</text>
						<text v-if="item.huodong_status==2" class="index_active_audit_end ml-5">已结束</text>
					</view>
					<view class="f-12 c-999999 mt-5 ellipsis">{{item.company_name}}</view>
					<view class="display_flex mt-5">
						<view class="flex-1 display_flex">
							<view class="index_active_addr_box">
								<image class="index_active_addr_icon" :src="onlinePic+'index_active_addr_icon.png'">
								</image>
								<view class="c-999999 f-9 ellipsis" style="margin-left: 4rpx;">{{item.city}}</view>
							</view>
							<!-- <view class="f-10 c-999999 ml-5 ellipsis flex-1">哈尔滨中冀先锋斯巴鲁汽车销售服务有限公司</view> -->
							<view class="f-10 c-999999 ml-5">{{item.start_time}} - {{item.end_time}}</view>
						</view>
					</view>
				</view>
				<view v-if="activeendlist.length>0" class="index_active_cell" v-for="(item,index) in activeendlist"
					:key="item.huodong_id" @click="goActiveInfo(item.huodong_id,item.huodong_status,item.title)">
					<view class="index_active_imgs_box">
						<image class="index_active_imgs" :src="item.cover?picUrl+item.cover:picUrl+item.pic"
							mode="aspectFill">
						</image>
					</view>
					<view class="mt-10 f-14">
						{{item.title}}
						<text v-if="item.huodong_status==0" class="index_active_audit_before ml-5">招募中</text>
						<text v-if="item.huodong_status==1" class="index_active_audit_ing ml-5">进行中</text>
						<text v-if="item.huodong_status==2" class="index_active_audit_end ml-5">已结束</text>
					</view>
					<view class="f-12 c-999999 mt-5 ellipsis">{{item.company_name}}</view>
					<view class="display_flex mt-5">
						<view class="flex-1 display_flex">
							<view class="index_active_addr_box">
								<image class="index_active_addr_icon" :src="onlinePic+'index_active_addr_icon.png'">
								</image>
								<view class="c-999999 f-9" style="margin-left: 4rpx;">{{item.city}}</view>
							</view>
							<view class="f-10 c-999999 ml-5">{{item.start_time}} - {{item.end_time}}</view>
						</view>
					</view>
				</view>
				<view v-if="activeloadingTitle" class="page_bottom_loading" style="padding-bottom:50rpx;">
					{{activeloadingTitle}}
				</view>
			</view>
			<view v-if="indexType==2" class="index_bbs_box">

				<view class="bbs_waterfall_box" v-if="indexBbsType==1">
					<view class="leftbox">
						<view class="mb-10" v-for="(item,index) in list" :key="item.card_id" v-if="index%2==0">
							<view @click="goInfo(item.card_id,index)">
								<image class="bbs_waterfall_images"
									:src="item.cover?picUrl+item.cover:picUrl+item.image[0]" mode="widthFix"></image>
								<view class="bbs_waterfall_content">
									<view class="ellipsis-2 f-13" style="letter-spacing: 1rpx;">{{item.title}}</view>
								</view>
							</view>
							<view class="display_flex mt-5" style="padding: 0 15rpx;">
								<view @click="goInfo(item.card_id,index)" class="bbs_waterfall_user_info">
									<image class="bbs_waterfall_avater_img"
										:src="item.user.headimg_url?picUrl+item.user.headimg_url:onlinePic+'avatar.png'">
									</image>
									<view class="ml-5 flex-1">
										<view class="f-11 c-666666 ellipsis">{{item.user.username}}</view>
									</view>
								</view>
								<view class="display_flex" @click="changeCardPraise(item.card_id,index,item.is_praise)">
									<image v-if="item.is_praise==1" class="bbs_waterfall_zan_icon"
										:src="onlinePic+'zan_on.png'">
									</image>
									<image v-else class="bbs_waterfall_zan_icon" :src="onlinePic+'bbs_zan.png'"></image>
									<view class="bbs_other_text ml-5 c-666666 f-11">{{item.praise_num}}</view>
								</view>
							</view>
						</view>
					</view>
					<view class="rightbox">
						<view class="mb-10" v-for="(item,index) in list" :key="item.card_id" v-if="index%2!=0">
							<view @click="goInfo(item.card_id,index)">

								<image class="bbs_waterfall_images"
									:src="item.cover?picUrl+item.cover:picUrl+item.image[0]" mode="widthFix"></image>
								<view class="bbs_waterfall_content">
									<view class="ellipsis-2 f-13" style="letter-spacing: 1rpx;">{{item.title}}</view>
								</view>
							</view>
							<view class="display_flex mt-5" style="padding: 0 15rpx;">
								<view @click="goInfo(item.card_id,index)" class="bbs_waterfall_user_info">
									<image class="bbs_waterfall_avater_img"
										:src="item.user.headimg_url?picUrl+item.user.headimg_url:onlinePic+'avatar.png'">
									</image>
									<view class="ml-5 flex-1">
										<view class="f-11 c-666666 ellipsis">{{item.user.username}}</view>
									</view>
								</view>
								<view class="display_flex" @click="changeCardPraise(item.card_id,index,item.is_praise)">
									<image v-if="item.is_praise==1" class="bbs_waterfall_zan_icon"
										:src="onlinePic+'zan_on.png'">
									</image>
									<image v-else class="bbs_waterfall_zan_icon" :src="onlinePic+'bbs_zan.png'"></image>
									<view class="bbs_other_text ml-5 c-666666 f-11">{{item.praise_num}}</view>
								</view>
							</view>
						</view>
					</view>

				</view>
				<view v-if="indexBbsType==1&&loadingTitle" class="page_bottom_loading" style="padding-bottom:50rpx;">
					{{loadingTitle}}
				</view>
				<view class="bbs_waterfall_box" v-if="indexBbsType==2">
					<view class="leftbox">
						<view class="mb-10" v-for="(item,index) in mybbslist" :key="item.card_id" v-if="index%2==0">
							<view @click="goInfo(item.card_id,index)">

								<image class="bbs_waterfall_images"
									:src="item.cover?picUrl+item.cover:picUrl+item.image[0]" mode="widthFix"></image>
								<view class="bbs_waterfall_content">
									<view class="ellipsis-2 f-13" style="letter-spacing: 1rpx;">{{item.title}}</view>
								</view>
							</view>
							<view class="display_flex mt-5" style="padding: 0 15rpx;">
								<view class="display_flex">
									<image class="bbs_waterfall_show_icon" :src="onlinePic+'read_icon.png'"></image>
									<view class="bbs_other_text ml-5 c-666666 f-11">{{item.show_num}}</view>
								</view>
								<view class="display_flex ml-15">
									<image class="bbs_waterfall_zan_icon" :src="onlinePic+'bbs_zan.png'"></image>
									<view class="bbs_other_text ml-5 c-666666 f-11">{{item.praise_num}}</view>
								</view>
							</view>
						</view>
					</view>
					<view class="rightbox">
						<view class="mb-10" v-for="(item,index) in mybbslist" :key="item.card_id" v-if="index%2!=0">
							<view @click="goInfo(item.card_id,index)">

								<image class="bbs_waterfall_images"
									:src="item.cover?picUrl+item.cover:picUrl+item.image[0]" mode="widthFix"></image>
								<view class="bbs_waterfall_content">
									<view class="ellipsis-2 f-13" style="letter-spacing: 1rpx;">{{item.title}}</view>
								</view>
							</view>
							<view class="display_flex mt-5" style="padding: 0 15rpx;">

								<view class="display_flex">
									<image class="bbs_waterfall_show_icon" :src="onlinePic+'read_icon.png'"></image>
									<view class="bbs_other_text ml-5 c-666666 f-11">{{item.show_num}}</view>
								</view>
								<view class="display_flex ml-15">
									<image class="bbs_waterfall_zan_icon" :src="onlinePic+'bbs_zan.png'"></image>
									<view class="bbs_other_text ml-5 c-666666 f-11">{{item.praise_num}}</view>
								</view>
							</view>
						</view>
					</view>
				</view>
				<view v-if="indexBbsType==2&&loadingTitlemybbs" class="page_bottom_loading"
					style="padding-bottom:50rpx;">
					{{loadingTitlemybbs}}
				</view>
			</view>
		</view>
		<view class="index_post_box" @click="goPost" :style="indexGuide==3?'z-index: 1001;':''">
			<image class="index_post_img" :src="onlinePic+'post.png'"></image>
		</view>
		<tab-Bar :tabbarnum="0" :myNoticeNum="isDot" :random="random"></tab-Bar>
		<view v-if="showSignin" class="mask_box" @click="closePopup"></view>
		<view class="popup_signin_box" v-if="showSignin">
			<view class="popup_signin_top_left_block"></view>
			<image class="popup_signin_xiong" :src="onlinePic+'signin/signin_xiong.png'"></image>
			<view class="popup_signin_top_right_block"></view>
			<view class="signin_pop_block">
				<view class="signin_pop_top_text_box">
					<view class="signin_pop_top_text">签到有礼
						<view class="racy_line_box"></view>
					</view>
				</view>
				<view class="text-c c-999999 f-12">连续签到有福利哦！</view>
			</view>
			<view class="popup_signin_days_box">
				<uni-row :gutter="20">
					<uni-col v-for="(item,index) in sign_list" :key="item.id" :span="item.colnum==1?6:12">
						<view class="days_cell_box">
							<view class="f-12 c-999999">{{item.week}}</view>
							<view v-if="item.prize_id>0"
								:class="item.is_sign==2?'days_cell':'days_cell days_cell_gift'">
								<view v-if="item.colnum==1" :class="item.is_sign==2?'':'days_cell_gift_bk310'">
									<view class="f-12">{{item.days}}</view>
									<image class="days_oil_img"
										:src="item.prize_info.pic?picUrl+item.prize_info.pic:picUrl+item.pic"
										mode="aspectFill"></image>
									<view class="f-12 c-999999">
										{{item.prize_info.text?item.prize_info.text:item.integral_text}}
									</view>
								</view>
								<view v-else :class="item.is_sign==2?'':'days_cell_gift_bk613'">
									<view class="days7_time f-12">{{item.days}}</view>
									<image class="days7_oil_img"
										:src="item.prize_info.pic?picUrl+item.prize_info.pic:picUrl+item.pic"
										mode="aspectFill"></image>
									<view class="days7_oilnum f-12 c-999999">
										{{item.prize_info.text?item.prize_info.text:item.integral_text}}
									</view>
								</view>
							</view>
							<view v-else class="days_cell">
								<view class="f-12">{{item.days}}</view>
								<image v-if="item.is_sign==2" class="days_oil_img" :src="picUrl+item.pic"
									mode="aspectFill" style="-webkit-filter: grayscale(100%);filter: grayscale(100%);">
								</image>
								<image v-else class="days_oil_img" :src="picUrl+item.pic" mode="aspectFill"></image>
								<view class="f-12 c-999999">{{item.integral_text}}</view>
							</view>
						</view>
					</uni-col>
				</uni-row>
				<view class="group_public_btn_block f-w f-18 mt-15" @click="goSignin">马上去签到</view>
			</view>
		</view>
		<view v-if="popupImg||popupGImg" class="mask_box" @click="closePopup"></view>
		<view class="popup_img_box" v-if="popupImg">
			<image class="popup_img" :src="onlinePic+'popup_img.png'" mode="widthFix"></image>
			<view class="popup_text_box">
				<text>{{popup_text}}</text>
			</view>
			<view class="pop_close_icon_box">
				<uni-icons class="pop_close_icon" @click="closePopup" type="close" color="#ffffff"
					size="50"></uni-icons>
			</view>
		</view>
		<view class="popup_img_box" v-if="popupGImg">
			<image class="popup_img" :src="onlinePic+'popup_img.png'" mode="widthFix"></image>
			<view class="popup_text_box">
				<text>{{card_add_popup}}</text>
			</view>
			<view class="popup_sub">
				<view class="sub left" @click="closePopup">关闭弹框</view>
				<view class="sub right" @click="joinGroup">加入车友会</view>
			</view>
		</view>
		<view v-if="showDSSPoup" class="mask_box"></view>
		<view class="popup_img_box" v-if="showDSSPoup">
			<image class="popup_img" :src="onlinePic+'popup_img.png'" mode="widthFix"></image>
			<view class="popup_text_box">
				<text>{{dss_pop_content}}</text>
			</view>
			<view class="popup_sub">
				<view class="sub left" @click="closeDSSPopup">关闭弹框</view>
				<view class="sub right" @click="goDSSPage">{{dds_pop_butoon_text}}</view>
			</view>
		</view>
		<view v-if="indexGuide==4||indexGuide==5" class="index_guide_tabbar_box"
			:style="'background-color:#fff;padding-bottom:'+botheight+ 'rpx;'">
			<view class="index_tabbar_cell" v-for="(item,index) in tabbarlist" :key="index">
				<view class="tabbar_nav" :style="index==indexGuide-4?'z-index:1002;':''" @click="goIndexTab(index)">
					<view class="tabbar_icon_box">
						<image class="tabbar_icon" :src="item.iconPath"></image>
					</view>
					<view :class="index==0?'tabbar_title':'tabbar_title c-gray'">{{item.title}}
					</view>
				</view>
			</view>
			<view class="tabbar_mask_box"></view>
		</view>
		<view class="guide_mask_box" v-if="indexGuide>0"></view>
		<view class="page_guide_left_btn_popup" v-if="indexGuide==1" :style="'top:'+ buttonGuideTop +'rpx;'">
			<image class="page_guide_img" :src="onlinePic+'guide/1.png'" @click="goNextGuide(1)"></image>
		</view>
		<view class="page_guide_right_btn_popup" v-if="indexGuide==2" :style="'top:'+ buttonGuideTop +'rpx;'">
			<image class="page_guide_img" :src="onlinePic+'guide/2.png'" @click="goNextGuide(2)"></image>
		</view>
		<view class="page_guide_post_popup" v-if="indexGuide==3">
			<image class="page_guide_img" :src="onlinePic+'guide/3.png'" @click="goNextGuide(3)"></image>
		</view>
		<view class="page_guide_tabbar1_popup" v-if="indexGuide==4" :style="'bottom: '+ guidebotheight +'rpx;'">
			<image class="page_guide_img" :src="onlinePic+'guide/4.png'" @click="goNextGuide(4)"></image>
		</view>
		<view class="page_guide_tabbar2_popup" v-if="indexGuide==5" :style="'bottom: '+ guidebotheight +'rpx;'">
			<image class="page_guide_img" :src="onlinePic+'guide/5.png'" @click="goNextGuide(5)"></image>
		</view>
	</view>
</template>
<script>
	import {
		getClubBannerList,
		getClubRecommend,
		getClubWelfare,
		getClubCardsList,
		changeCardPraise,
		getGroupUserInfo,
		getSigninInfo,
		getClubConfig,
		getIndexActiveList,
		getIndexActiveEndList,
		getClubMyBbsList,
		noticeTemplate
	} from '@/api/motortime.js';
	let app = getApp()
	export default {
		data() {
			return {
				user_id: '',
				current: 0,
				current1: 0,
				current2: 0,
				bannerlist: [],
				recommendlist1: [],
				recommendlist2: [],
				index_button_left: '',
				index_button_right: '',
				welfareinfo: '',
				params: {
					top: 1,
					page: 1,
					size: 10,
					user_id: 0,
					huodong_id: 0
				},
				list: [],
				paramsmybbs: {
					page: 1,
					size: 10,
				},
				mybbslist: [],
				paramsactive: {
					page: 1,
					size: 10,
				},
				activelist: [],
				activeendlist: [],
				jion_percent: 1,
				picUrl: app.globalData.picUrl,
				videoUrl: app.globalData.videoUrl,
				onlinePic: app.globalData.onlinePic,
				loadingTitle: '',
				activeloadingTitle: '',
				loadingTitlemybbs: '',
				pdbottom: uni.getSystemInfoSync().safeAreaInsets.bottom ? uni.getSystemInfoSync().safeAreaInsets.bottom +
					130 : 130,
				progressNum: 20,
				isDot: 0,
				club_id: 0,
				sign_list: [],
				signin_info: '',
				showSignin: false,
				popupImg: false,
				popup_text: '',
				popupGImg: false,
				card_add_popup: '',
				indexGuide: 0,
				buttonGuideTop: 0,
				tabbarlist: [{
						pagePath: "/pages/index/index",
						iconPath: "/static/images/icon/index_select.png",
						title: '首页'
					},
					{
						pagePath: "/pages/group/group",
						iconPath: "/static/images/icon/groups.png",
						title: '车友会'
					},
					{
						pagePath: "/pages/video/video",
						iconPath: "/static/images/icon/video.png",
						title: '视频'
					},
					{
						pagePath: "/pages/my/my",
						iconPath: "/static/images/icon/my.png",
						title: '我的'
					}
				],
				indexType: 1,
				indexBbsType: 1,
				scrollTop: 0,
				scrollTop1: 0,
				scrollTop2: 0,
				bbs_top_height: 0,
				userinfo: '',
				showDSSPoup: false,
				dss_pop_status: '',
				dss_pop_url: '',
				dss_pop_content: '',
				dds_pop_butoon_text: '',
				botheight: uni.getSystemInfoSync().safeAreaInsets.bottom ? uni.getSystemInfoSync().safeAreaInsets
					.bottom : 0,
				guidebotheight: uni.getSystemInfoSync().safeAreaInsets.bottom ? uni.getSystemInfoSync().safeAreaInsets
					.bottom + 100 : 100,
			}
		},
		onShow() {
			if (uni.getStorageSync('taskType')) {
				this.indexType = 2
				// bbs_box_new
				uni.createSelectorQuery().select('.bbs_box_new').boundingClientRect(rect => {
					if (rect.top > 350) {
						uni.pageScrollTo({
							scrollTop: rect.top,
							duration: 0
						})
					}
				}).exec();
				uni.removeStorage({
					key: 'taskType'
				})
			}

			if (uni.getStorageSync('onload') || uni.getStorageSync('indexload')) {
				this.userinfo = uni.getStorageSync('userinfo')

				this.club_id = uni.getStorageSync('userinfo') ? uni.getStorageSync('userinfo').club_id : 0
				this.params.user_id = uni.getStorageSync('userinfo') ? uni.getStorageSync('userinfo').user_id : 0
				if (uni.getStorageSync('clubconfig')) {
					this.card_add_popup = uni.getStorageSync('clubconfig').card_add_popup
					this.index_button_left = uni.getStorageSync('clubconfig').index_button_left
					this.index_button_right = uni.getStorageSync('clubconfig').index_button_right
					this.dss_pop_status = uni.getStorageSync('clubconfig').index_pop.pop_status
					this.dss_pop_url = uni.getStorageSync('clubconfig').index_pop.pop_url
					this.dss_pop_content = uni.getStorageSync('clubconfig').index_pop.pop_content
					this.dds_pop_butoon_text = uni.getStorageSync('clubconfig').index_pop.pop_butoon_text
				} else {
					this.getClubConfig()
				}
				uni.removeStorage({
					key: 'indexload'
				})
				uni.removeStorage({
					key: 'onload'
				})
				this.getClubBannerList()
				this.getClubRecommend1()
				this.getClubWelfare()
				this.list = []
				this.params.page = 1
				this.getClubCardsList()
				uni.showLoading()
				this.getIndexActiveList()
				this.mybbslist = []
				this.paramsmybbs.page = 1
				this.getClubMyBbsList()
			}
			if (uni.getStorageSync('onloadbbs')) {
				this.list = []
				this.params.page = 1
				this.getClubCardsList()
				uni.showLoading()
				this.getIndexActiveList()
				this.mybbslist = []
				this.paramsmybbs.page = 1
				this.getClubMyBbsList()
				uni.removeStorage({
					key: 'onloadbbs'
				})
			}
			if (uni.getStorageSync('access_token')) {
				this.getGroupUserInfo()
			}
			//sign_status:1开启签到；0关闭签到
			if (uni.getStorageSync('isPageGuide')) {
				if (uni.getStorageSync('clubconfig').sign_status == 1) {
					this.getSigninInfo()
				} else {
					if (uni.getStorageSync('clubconfig').index_pop.pop_status == 1) {
						const today = new Date().toISOString().split('T')[0]; // 获取今天的日期（YYYY-MM-DD）
						const hasSeenToday = uni.getStorageSync('seenPopup' + today);
						if (!hasSeenToday) {
							this.showDSSPoup = true
							uni.setStorage({
								key: 'seenPopup' + today,
								data: true
							})
							this.getPreviousDay()
						}

					}
				}
			}

			if (uni.getStorageSync('praiseinfo')) {
				var index = parseInt(uni.getStorageSync('praiseinfo').card_index)
				this.list[index].praise_num = uni.getStorageSync('praiseinfo').praise_num
				this.list[index].is_praise = uni.getStorageSync('praiseinfo').is_praise
				uni.removeStorage({
					key: 'praiseinfo'
				})
			}
		},
		onLoad() {

			this.params.user_id = uni.getStorageSync('userinfo') ? uni.getStorageSync('userinfo').user_id : 0
			this.club_id = uni.getStorageSync('userinfo') ? uni.getStorageSync('userinfo').club_id : 0
			this.getClubBannerList()
			this.getClubRecommend1()
			this.getClubWelfare()
			if (!uni.getStorageSync('indexload') && !uni.getStorageSync('onload') && !uni.getStorageSync('indexload')) {
				this.list = []
				this.params.page = 1
				this.getClubCardsList()
				uni.showLoading()
				this.getIndexActiveList()
				this.mybbslist = []
				this.paramsmybbs.page = 1
				if (uni.getStorageSync('access_token')) {
					this.getClubMyBbsList()
				}

			}

			if (uni.getStorageSync('clubconfig')) {
				this.card_add_popup = uni.getStorageSync('clubconfig').card_add_popup
				this.index_button_left = uni.getStorageSync('clubconfig').index_button_left
				this.index_button_right = uni.getStorageSync('clubconfig').index_button_right
				this.dss_pop_status = uni.getStorageSync('clubconfig').index_pop.pop_status
				this.dss_pop_url = uni.getStorageSync('clubconfig').index_pop.pop_url
				this.dss_pop_content = uni.getStorageSync('clubconfig').index_pop.pop_content
				this.dds_pop_butoon_text = uni.getStorageSync('clubconfig').index_pop.pop_butoon_text
			} else {
				this.getClubConfig()
			}
			var params = {
				event_code: '首页',
				path: 'pages/index/index',
				event_id: '',
				title: '',
				source_page: '',
				value: '',
			}
			app.BurialPoint(params)
			uni.hideTabBar()
		},
		onPageScroll: function(e) {
			this.scrollTop = e.scrollTop
		},
		methods: {
			goNextGuide(index) {
				if (index < 5) {
					this.indexGuide = index + 1
				} else {
					this.indexGuide = 0
					uni.setStorage({
						key: 'isPageGuide',
						data: true
					})
				}
				var params = {
					event_code: '首页',
					path: 'pages/index/index',
					event_id: '',
					title: '',
					source_page: '首页-引导第' + index + '步',
					value: '',
				}
				app.BurialPoint(params)
			},
			goIndexTab(num) {
				var index = 4 + num
				this.goNextGuide(index)
			},
			getSigninInfo() {
				getSigninInfo({
					user_id: uni.getStorageSync('userinfo') ? uni.getStorageSync('userinfo').user_id : 0
				}).then(res => {
					if (res.state == 1) {
						this.signin_info = res.data.info
						if (res.data.info.sign_status == 0) {
							this.showSignin = true
							var list = res.data.info.sign_list
							if (list.length > 0) {
								this.sign_list = list.slice(-7)
							}
						} else {
							this.showSignin = false
							if (this.dss_pop_status == 1) {
								const today = new Date().toISOString().split('T')[0]; // 获取今天的日期（YYYY-MM-DD）
								const hasSeenToday = uni.getStorageSync('seenPopup' + today);
								if (!hasSeenToday) {
									this.showDSSPoup = true
									uni.setStorage({
										key: 'seenPopup' + today,
										data: true
									})
									this.getPreviousDay()
								}
							}
						}

					} else {
						uni.showToast({
							title: res.error[0],
							mask: true,
							icon: 'none',
							duration: 1500
						})
					}
				})
			},
			goSignin() {
				var params = {
					event_code: '首页',
					path: 'pages/index/index',
					event_id: '',
					title: '',
					source_page: '首页-马上去签到',
				}
				app.BurialPoint(params)
				if (uni.getStorageSync('access_token')) {
					uni.navigateTo({
						url: '/pages/signin/signin'
					})
				} else {
					uni.navigateTo({
						url: '/pages/login/login'
					})
				}
			},
			getGroupUserInfo() {
				getGroupUserInfo({
					user_id: uni.getStorageSync('userinfo') ? uni.getStorageSync('userinfo').user_id : ''
				}).then(res => {
					if (res.state == 1) {
						this.userinfo = res.data.list
						if (res.data.list.msg_number > 0 || res.data.list.msg_comment_number) {
							this.isDot = 1
						} else {
							this.isDot = 0
						}
						this.club_id = res.data.list.club_id
						uni.setStorage({
							key: 'userinfo',
							data: res.data.list,
							success: function() {

							}
						});

					} else {
						uni.removeStorage({
							key: 'access_token'
						})
					}
				})
			},
			getClubBannerList() {
				getClubBannerList({}).then(res => {
					if (res.state == 1) {
						this.bannerlist = res.data.list
					} else {
						uni.showToast({
							title: res.error[0],
							mask: true,
							icon: 'none',
							duration: 1500
						})
					}
				})
			},
			getClubRecommend1() {
				getClubRecommend({
					position: 1
				}).then(res => {
					if (res.state == 1) {
						this.recommendlist1 = res.data.list
						this.getClubRecommend2()
					} else {
						uni.showToast({
							title: res.error[0],
							mask: true,
							icon: 'none',
							duration: 1500
						})
					}
				})
			},
			getClubRecommend2() {
				getClubRecommend({
					position: 2
				}).then(res => {
					if (res.state == 1) {
						this.recommendlist2 = res.data.list
						if (uni.getStorageSync('clubconfig').guide_status == 1) {
							if (!uni.getStorageSync('isPageGuide')) {
								if (this.recommendlist1.length > 0 && this.recommendlist2.length > 0) {
									// this.buttonGuideTop=465+30+ 230+30+ 230+30=1015-330=685-5
									this.buttonGuideTop = 688
									this.indexGuide = 1
								}
								if (this.recommendlist1.length > 0 && this.recommendlist2.length == 0) {
									// this.buttonGuideTop=465+30+ 230+30=755-330=425-5
									this.buttonGuideTop = 428
									this.indexGuide = 1
								}
								if (this.recommendlist1.length == 0 && this.recommendlist2.length > 0) {
									// this.buttonGuideTop=465+30+ 230+30=755-330=425-5
									this.buttonGuideTop = 428
									this.indexGuide = 1
								}
								if (this.recommendlist1.length == 0 && this.recommendlist2.length == 0) {
									// this.buttonGuideTop=465+30=495-330=165-5
									this.buttonGuideTop = 168
									this.indexGuide = 1
								}
							}
						}
						uni.createSelectorQuery().select('.bbs_box_new').boundingClientRect(rect => {
							this.bbs_top_height = rect.top
						}).exec();
					} else {
						uni.showToast({
							title: res.error[0],
							mask: true,
							icon: 'none',
							duration: 1500
						})
					}
				})
			},
			getClubWelfare() {
				getClubWelfare({}).then(res => {
					if (res.state == 1) {
						this.welfareinfo = res.data.info
						this.jion_percent = parseFloat(parseInt(res.data.info.join_money) / parseInt(res.data.info
							.target_money)) * 100
					} else {
						uni.showToast({
							title: res.error[0],
							mask: true,
							icon: 'none',
							duration: 1500
						})
					}
				})
			},
			getClubCardsList() {
				getClubCardsList(this.params).then(res => {
					if (res.state == 1) {
						this.list = [...this.list, ...res.data.data]
						this.current_page = res.data.current_page
						this.last_page = res.data.last_page
						if (this.list.length == 0) {
							this.loadingTitle = "- 暂无更多 -"
						}
						uni.hideLoading()
					} else {
						uni.showToast({
							title: res.error[0],
							mask: true,
							icon: 'none',
							duration: 1500
						})
					}
				})
			},
			getClubMyBbsList() {
				getClubMyBbsList(this.paramsmybbs).then(res => {
					if (res.state == 1) {
						this.mybbslist = [...this.mybbslist, ...res.data.data]
						this.current_pagemybbs = res.data.current_page
						this.last_pagemybbs = res.data.last_page
						if (this.mybbslist.length == 0) {
							this.loadingTitlemybbs = "- 暂无更多 -"
						}
						uni.hideLoading()
					} else {
						uni.showToast({
							title: res.error[0],
							mask: true,
							icon: 'none',
							duration: 1500
						})
					}
				})
			},
			getIndexActiveList() {
				getIndexActiveList({}).then(res => {
					if (res.state == 1) {
						this.activelist = res.data
						this.paramsactive.page = 1
						this.activeendlist = []
						this.getIndexActiveEndList()
					} else {
						uni.showToast({
							title: res.error[0],
							mask: true,
							icon: 'none',
							duration: 1500
						})
					}
				})
			},
			getIndexActiveEndList() {
				getIndexActiveEndList(this.paramsactive).then(res => {
					if (res.state == 1) {
						this.activeendlist = [...this.activeendlist, ...res.data.data]
						this.current_page_active = res.data.current_page
						this.last_page_active = res.data.last_page
						if (this.activeendlist.length == 0) {
							this.activeloadingTitle = "- 暂无更多 -"
						}
						uni.hideLoading()
					} else {
						uni.showToast({
							title: res.error[0],
							mask: true,
							icon: 'none',
							duration: 1500
						})
					}
				})
			},
			changeBanner(e) {
				this.current = e.detail.current
			},
			changeSwiper1(e) {
				this.current1 = e.detail.current
			},
			changeSwiper2(e) {
				this.current2 = e.detail.current
			},
			goIndexButton(type) {
				if (this.indexGuide == 0) {
					if (type == 1) {
						var local_name = '点击左按钮'
					} else if (type == 2) {
						var local_name = '点击右按钮'
					}
					var params = {
						event_code: '首页',
						path: 'pages/index/index',
						event_id: '',
						title: '',
						source_page: '首页-' + local_name,
					}
					app.BurialPoint(params)
					if (uni.getStorageSync('access_token')) {
						if (type == 1) {
							if (this.index_button_left.type == 1) { //小程序内跳转
								if (this.index_button_left.path_type == 'navigateTo') {
									uni.navigateTo({
										url: this.index_button_left.path
									})
								} else if (this.index_button_left.path_type == 'switchTab') {
									uni.switchTab({
										url: this.index_button_left.path
									})
								}
							} else if (this.index_button_left.type == 2) { //跳转其他小程序
								uni.navigateToMiniProgram({
									appId: this.index_button_left.appId,
									path: this.index_button_left.path,
									success(res) {
										// 打开成功
									}
								})
							} else if (this.index_button_left.type == 3) { //跳转H5
								uni.navigateTo({
									url: '/pages/webview/webview?path=' + this.index_button_left.path
								})
							} else if (this.index_button_left.type == 4) { //跳转H5
								this.popup_text = this.index_button_left.popup_text
								this.popupImg = true
							}
						} else if (type == 2) {
							if (this.index_button_right.type == 1) { //小程序内跳转
								if (this.index_button_right.path_type == 'navigateTo') {
									uni.navigateTo({
										url: this.index_button_right.path
									})
								} else if (this.index_button_right.path_type == 'switchTab') {
									uni.switchTab({
										url: this.index_button_right.path
									})
								}
							} else if (this.index_button_right.type == 2) { //跳转其他小程序
								uni.navigateToMiniProgram({
									appId: this.index_button_right.appId,
									path: this.index_button_right.path,
									success(res) {
										// 打开成功
									}
								})
							} else if (this.index_button_right.type == 3) { //跳转H5
								uni.navigateTo({
									url: url
								})
							} else if (this.index_button_right.type == 4) { //跳转H5
								this.popup_text = this.index_button_right.popup_text
								this.popupImg = true
							}
						}
					} else {
						uni.navigateTo({
							url: '/pages/login/login'
						})
					}
				} else {
					this.goNextGuide(type)
				}
			},
			goInfo(card_id, index) {
				var params = {
					event_code: '首页',
					path: 'pages/index/index',
					event_id: card_id,
					title: '',
					source_page: '首页-点击帖子',
				}
				app.BurialPoint(params)
				if (uni.getStorageSync('access_token')) {
					uni.navigateTo({
						url: '/pages/bbs/bbsinfo?card_id=' + card_id + '&card_index=' + index
					})
				} else {
					uni.navigateTo({
						url: '/pages/login/login'
					})
				}

			},
			goPost() {
				if (this.indexGuide == 0) {
					var params = {
						event_code: '首页',
						path: 'pages/index/index',
						event_id: '',
						title: '',
						source_page: '首页-点击发帖',
					}
					app.BurialPoint(params)
					if (uni.getStorageSync('access_token')) {
						if (this.userinfo.club_id > 0) {
							uni.navigateTo({
								url: '/pages/bbs/bbspost?club_id=' + this.club_id
							})
						} else {
							this.popupGImg = true
							this.card_add_popup = uni.getStorageSync('clubconfig').card_add_popup
						}

					} else {
						uni.navigateTo({
							url: '/pages/login/login'
						})
					}
				} else {
					this.goNextGuide(3)
				}
			},
			goBannerPath(type, path, appId, local) {
				if (local == 1) {
					var local_name = '点击Banner'
				} else if (local == 2) {
					var local_name = '点击位置1'
				} else if (local == 3) {
					var local_name = '点击位置2'
				}
				var params = {
					event_code: '首页',
					path: 'pages/index/index',
					event_id: '',
					title: '',
					source_page: '首页-' + local_name,
				}
				app.BurialPoint(params)
				if (uni.getStorageSync('access_token')) {
					if (type == 1) {
						uni.navigateTo({
							url: path
						})
					} else if (type == 2) {
						uni.navigateTo({
							url: '/pages/webview/webview?scene=' + path
						})
					} else if (type == 3) {
						uni.navigateToMiniProgram({
							appId: appId,
							path: path,
							success(res) {
								// 打开成功
							}
						})
					}
					// uni.navigateTo({
					// 	url: path
					// })

				} else {
					uni.navigateTo({
						url: '/pages/login/login'
					})
				}
			},
			changeCardPraise(card_id, index, type) {
				if (uni.getStorageSync('access_token')) {
					var params = {
						event_code: '首页',
						path: 'pages/index/index',
						event_id: card_id,
						title: this.list[index].title,
						source_page: '首页-帖子点赞/取消赞',
					}
					app.BurialPoint(params)
					changeCardPraise({
						card_id: card_id,
						type: type == 1 ? 0 : 1
					}).then(res => {
						if (res.state == 1) {
							this.list[index].praise_num = this.list[index].is_praise == 1 ? this.list[index]
								.praise_num - 1 : this.list[index]
								.praise_num + 1
							this.list[index].is_praise = this.list[index].is_praise == 1 ? 0 : 1
						} else {
							uni.showToast({
								title: res.error[0],
								mask: true,
								icon: 'none',
								duration: 1500
							})
						}
					})
				} else {
					uni.navigateTo({
						url: '/pages/login/login'
					})
				}
			},
			closePopup() {
				this.showSignin = false
				this.popupImg = false
				this.popupGImg = false
				var params = {
					event_code: '首页',
					path: 'pages/index/index',
					event_id: '',
					title: '',
					source_page: '关闭弹窗',
					value: '',
				}
				app.BurialPoint(params)
				if (this.dss_pop_status == 1) {
					const today = new Date().toISOString().split('T')[0]; // 获取今天的日期（YYYY-MM-DD）
					const hasSeenToday = uni.getStorageSync('seenPopup' + today);
					if (!hasSeenToday) {
						this.showDSSPoup = true
						uni.setStorage({
							key: 'seenPopup' + today,
							data: true
						})
						this.getPreviousDay()
					}
				}
			},
			getPreviousDay() {
				const now = new Date();
				const previousDay = new Date(now); // 复制当前日期对象
				previousDay.setDate(now.getDate() - 1); // 减去一天

				// 格式化日期为YYYY-MM-DD
				const year = previousDay.getFullYear();
				const month = String(previousDay.getMonth() + 1).padStart(2, '0'); // 月份从0开始，需要加1
				const day = String(previousDay.getDate()).padStart(2, '0');
				var yesterday = `${year}-${month}-${day}`
				console.log('yesterday==' + yesterday)

				if (uni.getStorageSync('seenPopup' + yesterday)) {
					uni.removeStorage({
						key: 'seenPopup' + yesterday
					})
				}
			},
			closeDSSPopup() {

				this.showDSSPoup = false
				var params = {
					event_code: '首页',
					path: 'pages/index/index',
					event_id: '',
					title: '',
					source_page: '首页-关闭大师赛弹窗',
				}
				app.BurialPoint(params)
			},
			goDSSPage() {
				if (uni.getStorageSync('access_token')) {
					uni.navigateTo({
						url: this.dss_pop_url
					})
					this.showDSSPoup = false
				} else {
					uni.navigateTo({
						url: '/pages/login/login'
					})
				}
				var params = {
					event_code: '首页',
					path: 'pages/index/index',
					event_id: '',
					title: '',
					source_page: '弹窗-跳转页面',
					value: '',
				}
				app.BurialPoint(params)
			},
			joinGroup() {
				var that = this
				if (uni.getStorageSync('access_token')) {
					// #ifdef  MP-WEIXIN
					uni.requestSubscribeMessage({
						tmplIds: ['kwpV3YHFx0TJQXZGE1dmXyPuKB5KEhhxSols7MgJYKk'],
						success: function(res) {
							noticeTemplate({
								template_type: 4 //4:车友会；5:活动报名结果；6:活动创建结果
							}).then(res => {
								if (res.state == 1) {
									uni.navigateTo({
										url: '/pages/group/groupjoin'
									})
									that.popupGImg = false
								} else {

								}
							})
						},
						fail: function(e) {
							console.log(e)
						}
					})
					// #endif
					// #ifndef MP-WEIXIN
					uni.navigateTo({
						url: '/pages/group/groupjoin'
					})
					// #endif
				} else {
					uni.navigateTo({
						url: '/pages/login/login'
					})
				}
				var params = {
					event_code: '首页',
					path: 'pages/index/index',
					event_id: '',
					title: '',
					source_page: '弹窗-加入车友会',
					value: '',
				}
				app.BurialPoint(params)
			},
			getClubConfig() {
				getClubConfig({}).then(res => {
					if (res.state == 1) {
						uni.setStorage({
							key: 'clubconfig',
							data: res.data,
							success: function() {}
						});
						this.card_add_popup = res.data.card_add_popup
						this.index_button_left = res.data.index_button_left
						this.index_button_right = res.data.index_button_right
						this.dss_pop_status = res.data.index_pop.pop_status
						this.dss_pop_url = res.data.index_pop.pop_url
						this.dss_pop_content = res.data.index_pop.pop_content
						this.dds_pop_butoon_text = res.data.index_pop.pop_butoon_text
					} else {}
				})
			},
			changeIndexType(type) {
				this.indexType = type
				if (this.scrollTop > this.bbs_top_height || this.scrollTop == this.bbs_top_height) {
					var that = this
					setTimeout(function() {
						uni.pageScrollTo({
							scrollTop: that.bbs_top_height,
							duration: 0
						})
					}, 200)
				}
			},
			changeBbsTabs(type) {
				this.indexBbsType = type
				if (type == 1) {

				} else if (type == 2) {

				}
			},
			goActiveInfo(huodong_id, huodong_status, title) {
				var params = {
					event_code: '首页',
					path: 'pages/index/index',
					event_id: huodong_id,
					title: title,
					source_page: '首页-点击活动',
				}
				app.BurialPoint(params)
				if (uni.getStorageSync('access_token')) {
					if (huodong_status == 0) {
						uni.navigateTo({
							url: '/pages/group/groupactiveinfo?huodong_id=' + huodong_id + '&club_id=' + this
								.club_id
						})
					} else {
						uni.navigateTo({
							url: '/pages/group/groupactive?huodong_id=' + huodong_id + '&club_id=' + this.club_id
						})
					}
				} else {
					uni.navigateTo({
						url: '/pages/login/login'
					})
				}
			},
			goClubInfo(club_id, club_name) {
				var params = {
					event_code: '首页',
					path: 'pages/index/index',
					event_id: club_id,
					title: club_name,
					source_page: '首页-点击车友会',
					value: '',
				}
				app.BurialPoint(params)
				if (uni.getStorageSync('access_token')) {
					uni.navigateTo({
						url: '/pages/my/mygroups'
					})
				} else {
					uni.navigateTo({
						url: '/pages/login/login'
					})
				}

			},
		},
		onPullDownRefresh() {
			if (this.indexType == 1) {
				this.getIndexActiveList()
			} else if (this.indexType == 2) {
				this.getClubBannerList()
				this.getClubRecommend1()
				this.getClubWelfare()
				this.getClubConfig()
				if (this.indexBbsType == 1) {
					this.params.page = 1
					this.list = []
					this.getClubCardsList()
				} else if (this.indexBbsType == 2) {
					this.paramsmybbs.page = 1
					this.mybbslist = []
					this.getClubMyBbsList()
				}
			}
			uni.stopPullDownRefresh()
		},
		onReachBottom() {
			var that = this
			setTimeout(function() {
				uni.showLoading({
					title: '加载中'
				})
				if (that.indexType == 1) {
					if (that.current_page_active < that.last_page_active) {
						that.showLoading = true
						that.paramsactive.page = that.paramsactive.page + 1
						that.getIndexActiveEndList()
					} else {
						uni.hideLoading()
						that.showLoading = false
						if (that.activeendlist.length > 0) {
							that.activeloadingTitle = "- 已经到底了 -"
						} else {
							that.activeloadingTitle = "- 暂无更多 -"
						}
					}
				} else if (that.indexType == 2) {
					if (that.indexBbsType == 1) {
						if (that.current_page < that.last_page) {
							that.showLoading = true
							that.params.page = that.params.page + 1
							that.getClubCardsList()
						} else {
							uni.hideLoading()
							that.showLoading = false
							if (that.list.length > 0) {
								that.loadingTitle = "- 已经到底了 -"
							} else {
								that.loadingTitle = "- 暂无更多 -"
							}
						}
					} else if (that.indexBbsType == 2) {
						if (that.current_pagemybbs < that.last_pagemybbs) {
							that.showLoading = true
							that.paramsmybbs.page = that.paramsmybbs.page + 1
							that.getClubCardsList()
						} else {
							uni.hideLoading()
							that.showLoading = false
							if (that.mybbslist.length > 0) {
								that.loadingTitlemybbs = "- 已经到底了 -"
							} else {
								that.loadingTitlemybbs = "- 暂无更多 -"
							}
						}
					}
				}
			}, 350)
		},
		onShareAppMessage(res) {
			app.getShareTask()
			return {
				title: uni.getStorageSync('clubconfig') ? uni.getStorageSync('clubconfig')
					.index_share_title : '斯巴鲁官方车友会',
				imageUrl: uni.getStorageSync('clubconfig') ? this.picUrl + uni.getStorageSync('clubconfig')
					.index_share_img : ''
			}
		},
		onShareTimeline: function() {
			app.getShareTask()
			return {
				title: uni.getStorageSync('clubconfig') ? uni.getStorageSync('clubconfig')
					.index_share_title : '斯巴鲁官方车友会',
				imageUrl: uni.getStorageSync('clubconfig') ? this.picUrl + uni.getStorageSync('clubconfig')
					.index_share_img : ''
			}
		},
	}
</script>

<style lang="scss">
	.index {
		.index_guide_tabbar_box {
			display: flex;
			flex-direction: row;
			justify-content: space-around;
			position: fixed;
			bottom: 0;
			left: 0;
			z-index: 1001;
			width: 100%;
			height: 100rpx;
			padding-bottom: constant(safe-area-inset-bottom);
			padding-bottom: env(safe-area-inset-bottom);
			box-shadow: rgba(0, 0, 0, 0.1) 0px 0px 1px 1px;

			.index_tabbar_cell {
				width: 100rpx;
				height: 100rpx;
				// border-radius: 50px;
			}

			.tabbar_nav {
				flex: 1;
				display: flex;
				flex-direction: column;
				justify-content: center;
				align-items: center;
				font-size: 24rpx;
				height: 100%;
				position: relative;
				background-color: #ffffff;
				border-radius: 50px;
			}

			.tabbar_icon_box {
				width: 78rpx;
				height: 60rpx;
				position: relative;
			}

			.tabbar_icon {
				width: 78rpx;
				height: 60rpx;
				vertical-align: middle;
			}

			.tabbar_mask_box {
				position: absolute;
				top: 0;
				bottom: 0;
				right: 0;
				left: 0;
				z-index: 1000;
				background: rgba(0, 0, 0, .6);
			}
		}

		.page_guide_center_popup {
			position: fixed;
			top: 400rpx;
			left: 0;
			right: 0;
			text-align: center;
			z-index: 1002;
		}

		//左右按钮是985-popup的高度=784
		.page_guide_left_btn_popup {
			position: fixed;
			top: 648rpx;
			left: 20rpx;
			z-index: 1002;
		}

		.page_guide_right_btn_popup {
			position: fixed;
			top: 648rpx;
			right: 20rpx;
			z-index: 1002;
		}

		.page_guide_post_popup {
			position: fixed;
			bottom: calc(16vh + 80rpx);
			right: 35rpx;
			z-index: 1002;
		}

		.page_guide_tabbar1_popup {
			position: fixed;
			// left: 7.5vw; //3个tabbar
			left: 3.5vw; //4个tabbar
			z-index: 1002;
		}

		.page_guide_tabbar2_popup {
			position: fixed;
			// left: 28.5vw; //3个tabbar
			left: 16vw; //4个tabbar
			z-index: 1002;
		}

		.page_guide_img {
			width: 512rpx;
			height: 330rpx;
			vertical-align: middle;
		}

		.swiper_img_box {
			width: 100%;
			height: 465rpx;
			position: relative;

			.swiper {
				width: 100%;
				height: 465rpx;

				.swiper_img {
					width: 100%;
					height: 465rpx;
				}

				.swiper_video_icon {
					position: absolute;
					top: 0;
					bottom: 0;
					left: 0;
					right: 0;
					display: flex;
					align-items: center;
					justify-content: center;

					.video_icon {
						width: 80rpx;
						height: 80rpx;
					}
				}

				.swiper_video_box {
					width: 100%;
					height: 465rpx;
					position: relative;
					display: flex;
					align-items: center;

					.swiper_video {
						width: 100%;
						height: 465rpx;
					}

					.swiper_video_mask {
						position: absolute;
						top: 0;
						right: 0;
						left: 0;
						bottom: 0;
						z-index: 1;
					}
				}
			}

			.swiper_dot_box {
				display: flex;
				align-items: center;
				justify-content: center;
				position: absolute;
				left: 0;
				right: 0;
				bottom: 30rpx;
				z-index: 1;

				.swiper_dot {
					width: 17rpx;
					height: 4rpx;
					margin-left: 20rpx;
					background-color: #ffffff;
				}

				.swiper_dot_active {
					width: 30rpx;
					height: 4rpx;
					background-color: #00A0DC;
				}
			}
		}

		// .swiper_group_box:last-child {
		// 	margin-bottom: 0;
		// }

		.swiper_group_box {
			width: 100%;
			height: 230rpx;
			margin-bottom: 30rpx;
			position: relative;

			.swiper_group {
				width: 100%;
				height: 230rpx;

				.swiper_group_item {
					.group_mask_box {
						position: absolute;
						top: 10rpx;
						right: 50%;
						bottom: 0;
						left: 0;
						z-index: 1;

						background: linear-gradient(to right, rgba(0, 0, 0, 0.85), rgba(0, 0, 0, 0));
						border-top-left-radius: 8rpx;
						border-bottom-left-radius: 8rpx;
					}

					.swiper_group_address {
						position: absolute;
						bottom: 40rpx;
						left: 40rpx;
						z-index: 2;
						font-size: 20rpx;
						color: #ffffff;
					}

					.swiper_group_address_border {
						position: absolute;
						bottom: 40rpx;
						left: 40rpx;
						z-index: 2;
						font-size: 18rpx;
						color: #ffffff;
						border-radius: 6rpx;
						padding: 2rpx 8rpx;
						border: 1rpx solid #FFFFFF;
					}

					.group_content_box {
						position: absolute;
						top: 0;
						right: 0;
						bottom: 0;
						left: 0;
						z-index: 2;
						padding: 40rpx;

						.group_carmodel {
							color: #ffffff;
							font-size: 30rpx;
							letter-spacing: 1rpx;
						}

						.group_carmodel_bottom {
							width: 20rpx;
							height: 4rpx;
							margin-top: 10rpx;
							background-color: #00A0DC;
						}

						.group_name {
							color: #ffffff;
							font-size: 30rpx;
							font-weight: bold;
							letter-spacing: 1rpx;
						}

						.group_mask_icon {
							width: 25rpx;
							height: 25rpx;
						}

						.group_check {
							width: 114rpx;
							height: 36rpx;
						}
					}
				}

				.swiper_group_img {
					position: absolute;
					top: 10rpx;
					right: 0;
					left: 0;
					bottom: 0;
					width: 100%;
					height: 220rpx;
					border-radius: 8rpx;
					vertical-align: middle;
				}

				.index_swiper_tips {
					position: absolute;
					top: 0;
					right: 40rpx;
					z-index: 2;
					width: 79rpx;
					height: 106rpx;
					vertical-align: middle;
				}
			}

			.swiper_group_dot_box {
				display: flex;
				align-items: center;
				justify-content: flex-end;
				position: absolute;
				bottom: 30rpx;
				left: 0;
				right: 40rpx;
				margin: 0 auto;
				z-index: 1;

				.swiper_dot {
					width: 17rpx;
					height: 4rpx;
					margin-left: 20rpx;
					background-color: #ffffff;
				}

				.swiper_dot_active {
					width: 30rpx;
					height: 4rpx;
					background-color: #00A0DC;
				}
			}
		}

		.index_center_btn_box {

			.index_center_btn_img {
				width: 100%;
				max-height: 120rpx;
				vertical-align: middle;
			}
		}

		.gongyi_box {
			margin-bottom: 30rpx;

			.gongyi_img_box {
				width: 100%;
				height: 420rpx;
				position: relative;
				border-radius: 8rpx;

				.gongyi_img {
					width: 100%;
					height: 420rpx;
					border-radius: 8rpx;
				}

			}



			.gongyi_content_box {
				position: relative;
				padding: 30rpx 30rpx 60rpx 30rpx;
				border-bottom-left-radius: 8rpx;
				border-bottom-right-radius: 8rpx;
				background: linear-gradient(to bottom, #FFFAF7, #FFE6D6);


				.benefit_tips_img {
					width: 190rpx;
					height: 36rpx;
					vertical-align: middle;
				}

				.xlxjh_text {
					color: #FB4B33;
					font-size: 22rpx;
					margin-left: 10rpx;
				}

				.gongyi_content_title_box {
					display: flex;
					align-items: flex-end;
					justify-content: space-between;
				}

				.gongyi_content_progress_box {
					width: 100;
					height: 20rpx;
					display: flex;
					align-items: center;
					border-radius: 16rpx;
					background-color: #F0E4DC;

					.gongyi_progress_on {
						height: 20rpx;
						border-radius: 16rpx;
						background-color: #FF8554;
					}

					.flag_icon {
						width: 42rpx;
						height: 42rpx;
						margin-left: -10rpx;
					}

					.gongyi_progres {
						height: 20rpx;
						border-radius: 16rpx;
						background-color: #F0E4DC;
					}
				}

				.money_text {
					color: #FB4B33;
					font-size: 28rpx;
					font-weight: bold;
					margin-left: 10rpx;
				}

				.content_title_icon {
					width: 28rpx;
					height: 32rpx;
					vertical-align: middle;
				}

				.gongyi_join_btn_box {
					display: flex;
					justify-content: center;

					.gongyi_join_btn {
						color: #ffffff;
						width: 200rpx;
						height: 70rpx;
						font-size: 30rpx;
						display: flex;
						align-items: center;
						justify-content: center;
						background: linear-gradient(to right, #FF8454, #FFAB60);
					}
				}
			}
		}

		.index_bbs_box {
			position: relative;
			padding: 0 30rpx;
		}

		.bbs_box {
			position: relative;
			padding: 0 30rpx;

			.racy_box {
				display: flex;
				align-items: center;
				justify-content: center;
				padding: 50rpx 0 30rpx 0;

				.reai_img {
					width: 102rpx;
					height: 42rpx;
					vertical-align: middle;
				}

				.racy_img {
					position: absolute;
					top: 55rpx;
					left: 0;
					right: 0;
					margin: 0 auto;
					z-index: 1;
					width: 235rpx;
					height: 13rpx;

				}
			}
		}

		.bbs_waterfall_box {
			display: flex;
			justify-content: space-between;

			.leftbox {
				width: calc(50% - 10rpx);
				float: left;
				margin-bottom: 20rpx;
			}

			.rightbox {
				width: calc(50% - 10rpx);
				float: left;
				margin-bottom: 20rpx;
			}

			.bbs_waterfall_images {
				width: 100%;
				max-height: 500rpx;
				border-radius: 8rpx;
				vertical-align: middle;
			}

			.bbs_waterfall_video_box {
				width: 100%;
				height: calc(28vw - 10rpx);
				position: relative;
			}

			.bbs_waterfall_video_mask {
				position: absolute;
				top: 0;
				left: 0;
				right: 0;
				bottom: 0;
				z-index: 1;
			}

			.bbs_waterfall_video {
				width: 100%;
				height: calc(28vw - 10rpx);
				border-radius: 8rpx;
				vertical-align: middle;
			}

			.bbs_waterfall_content {
				padding: 0 15rpx;
				margin-top: 10rpx;
			}

			.bbs_waterfall_user_info {
				flex: 1;
				display: flex;
				align-items: center;

				.bbs_waterfall_avater_img {
					width: 35rpx;
					height: 35rpx;
					border-radius: 100%;
					vertical-align: middle;
				}
			}

			.bbs_waterfall_zan_icon {
				width: 25rpx;
				height: 22rpx;
				vertical-align: middle;
			}

			.bbs_waterfall_show_icon {
				width: 34rpx;
				height: 24rpx;
				vertical-align: middle;
			}
		}

		.bbs_box::before {
			content: "";
			position: absolute;
			top: 0;
			left: 0;
			right: 0;
			height: 600rpx;
			z-index: -1;
			background: linear-gradient(to bottom, rgba(0, 160, 220, 0.15), #ffffff);
		}

		.bbs_box_new {
			position: relative;
			padding: 0 30rpx;

			.bbs_box_new_top {
				padding: 50rpx 0 50rpx 0;
				background-color: #ffffff;
				position: sticky;
				top: 0;
				z-index: 2;


				.bbs_box_top_title_left_box {
					position: relative;
					font-size: 34rpx;
					padding: 0 10rpx 0 70rpx;
					text-align: center;
					border-right: 1rpx solid #c6c6c6;
				}

				.bbs_box_top_title_right_box {
					position: relative;
					font-size: 34rpx;
					padding: 0 70rpx 0 10rpx;
					text-align: center;
				}


				.active_area_img {
					position: absolute;
					bottom: 2rpx;
					left: 70rpx;
					width: 76rpx;
					height: 76rpx;
					vertical-align: middle;
				}

				.bbs_area_img {
					position: absolute;
					bottom: 2rpx;
					right: 70rpx;
					width: 73rpx;
					height: 78rpx;
					vertical-align: middle;
				}

				.racy_line_box {
					position: absolute;
					bottom: 0;
					left: 70rpx;
					right: 10rpx;
					z-index: -1;
					height: 13rpx;
					background: linear-gradient(to right, #D4F3FF, #ffffff);
				}

				.racy_line_box_right {
					position: absolute;
					bottom: 0;
					right: 70rpx;
					left: 10rpx;
					z-index: -1;
					height: 13rpx;
					background: linear-gradient(to left, #D4F3FF, #ffffff);
				}

				.index_bbs_mygroup_box {
					padding: 40rpx 20rpx;
					background-color: #FFFBF7;

					.groupinfo_top {
						display: flex;
						align-items: center;

						.group_img_box {
							width: 145rpx;
							height: 145rpx;
							position: relative;

							.group_img {
								width: 145rpx;
								height: 145rpx;
								border-radius: 8rpx;
								vertical-align: middle;
							}

							.group_border_img {
								position: absolute;
								top: 0;
								right: 0;
								bottom: 0;
								left: 0;
								width: 145rpx;
								height: 145rpx;
								z-index: 1;
								vertical-align: middle;
							}
						}

						.group_title_box {
							flex: 1;
							margin-left: 20rpx;
							position: relative;

							.bbsinfo_praise_user_img {
								width: 30rpx;
								height: 30rpx;
								border-radius: 100%;
								margin-left: -10rpx;
							}
						}
					}
				}

				.index_bbs_tabs_box {
					position: sticky;
					top: 72px;
					padding-top: 20rpx;
					background-color: #ffffff;

					.index_bbs_tabs {
						display: flex;
						align-items: center;

						.index_bbs_tabs_cell {
							width: 50%;
							display: flex;
							align-items: center;
							justify-content: center;
							border-right: 1rpx solid #D1D1D1;
						}

						.tabs_cell_on {
							color: #00A0DC;
						}

						.index_bbs_tabs_cell:last-child {
							border-right: none;
						}

						.index_bbs_tabs_cell_bottom {
							width: 50rpx;
							height: 5rpx;
							margin-top: 10rpx;
							background: linear-gradient(to right, rgba(0, 160, 220, 0.35), #ffffff);
						}

						.index_bbs_tabs_cell_bottom_def {
							width: 50rpx;
							height: 5rpx;
							margin-top: 10rpx;
						}
					}
				}
			}

			.index_active_box {

				.index_active_cell {
					margin-bottom: 50rpx;

					.index_active_img_box {
						width: 100%;
						position: relative;
						// border-radius: 8rpx;

						.index_active_img {
							width: 100%;
							height: 220rpx;
							vertical-align: middle;
							border-top-left-radius: 8rpx;
							border-top-right-radius: 8rpx;
						}

						.index_active_progress_box {
							width: 100%;
							height: 25rpx;
							position: relative;
							border-bottom-left-radius: 8rpx;
							border-bottom-right-radius: 8rpx;
							background-color: #C7E2EC;

							.index_active_progress {
								height: 25rpx;
								position: absolute;
								bottom: 0;
								left: 0;
								z-index: 1;
								border-top-right-radius: 16rpx;
								border-bottom-right-radius: 16rpx;
								border-bottom-left-radius: 16rpx;
								background-color: #00A0DC;
							}

							.index_active_progress_img {
								width: 100%;
								height: 25rpx;
								position: absolute;
								bottom: 0;
								left: 0;
								right: 0;
								z-index: 2;
								border-top-right-radius: 16rpx;
								border-bottom-right-radius: 16rpx;
								border-bottom-left-radius: 8rpx;
								vertical-align: middle;
							}

							.index_active_progress_mask {
								width: 220rpx;
								height: 25rpx;
								position: absolute;
								bottom: 0;
								left: 0;
								z-index: 3;
								background: linear-gradient(to right, #B9ECFF, transparent);
								border-bottom-left-radius: 8rpx;
								border-bottom-right-radius: 8rpx;
							}

						}
					}

					.index_active_imgs_box {
						width: 100%;
						position: relative;
						border-radius: 8rpx;

						.uni-col {
							margin-bottom: 10rpx;
						}

						.index_active_imgs {
							width: 100%;
							height: 220rpx;
							border-radius: 8rpx;
							vertical-align: middle;
						}

						.index_active_sharenum {
							position: absolute;
							right: 15rpx;
							bottom: 25rpx;
							z-index: 1;
							display: flex;
							align-items: center;
							justify-content: center;
							background-color: rgba(0, 0, 0, 0.75);
							padding: 6rpx;
							border-radius: 4rpx;

							.index_active_sharenum_img {
								width: 19rpx;
								height: 21rpx;
								vertical-align: middle;
							}
						}
					}

					.index_active_audit_before {
						color: #ffffff;
						font-size: 18rpx;
						padding: 4rpx 10rpx;
						border-radius: 4rpx;
						background-color: #EA4A34;
						vertical-align: middle;
					}

					.index_active_audit_ing {
						color: #ffffff;
						font-size: 18rpx;
						padding: 4rpx 10rpx;
						border-radius: 4rpx;
						background-color: #07C061;
						vertical-align: middle;
					}

					.index_active_audit_end {
						color: #ffffff;
						font-size: 18rpx;
						padding: 4rpx 10rpx;
						border-radius: 4rpx;
						background-color: #717171;
						vertical-align: middle;
					}

					.index_active_addr_box {
						display: flex;
						align-items: center;
						justify-content: center;
						padding: 6rpx 12rpx;
						border-radius: 8rpx;
						border: 1rpx solid #CBCBCB;

						.index_active_addr_icon {
							width: 15rpx;
							height: 16rpx;
							vertical-align: middle;
						}
					}

					.emote_icon {
						width: 18rpx;
						height: 18rpx;
						margin-left: 4rpx;
						vertical-align: middle;
					}
				}
			}


		}

		.bbs_other_content {
			margin-top: 30rpx;
			display: flex;
			align-items: center;
			justify-content: space-between;

			.bbs_other_time {
				color: #A3A3A3;
				font-size: 24rpx;

			}

			.bbs_other_text {
				color: #A3A3A3;
				font-size: 24rpx;
			}

		}

		.popup_img_box {
			position: fixed;
			top: 150rpx;
			left: 60rpx;
			right: 16rpx;
			z-index: 1001;

			.popup_img {
				width: 100%;
				vertical-align: middle;
			}

			.popup_text_box {
				color: #666666;
				font-size: 28rpx;
				position: absolute;
				top: 20%;
				left: 66rpx;
				right: 115rpx;
				z-index: 1002;
				line-height: 42rpx;
			}

			.pop_close_icon_box {
				position: absolute;
				bottom: -80rpx;
				left: 0;
				right: 0;
				z-index: 1002;
				text-align: center;
			}

			.popup_sub {
				margin-top: 20rpx;
				margin-right: 44rpx;
				display: flex;
				align-items: center;
				justify-content: space-between;

				.sub {
					width: 287rpx;
					height: 80rpx;
					line-height: 80rpx;
					color: #FFFFFF;
					font-size: 36rpx;
					background-color: #00A0DC;
					border-radius: 8rpx;
					text-align: center;


					&.left {
						color: #00A0DC;
						background-color: #FFFFFF;
					}
				}
			}

		}

	}
</style>